<template>
  <div class="equipmentSoldEdit">
    <h4>申请信息</h4>
    <table class="table" rules="all" border="1">
      <tr>
        <td><span class="red">*</span>申请人</td>
        <td>
          <el-input v-model="addForm.applyUser" :disabled="true"></el-input>
        </td>
        <td><span class="red">*</span>申请时间</td>
        <td>
          <el-date-picker
            v-model="date"
            type="date"
            placeholder="选择日期">
          </el-date-picker>
        </td>
      </tr>
      <tr>
        <td>变卖理由</td>
        <td colspan="3">
          <el-input type="textarea" :rows="2" v-model="addForm.sellInfo"></el-input>
        </td>
      </tr>
    </table>
    <h4>变卖信息</h4>
    <el-button type="primary" icon="el-icon-plus" size="mini" @click="add">添加</el-button>
    <el-table :data="addData" v-loading="loading" border>
      <el-table-column align="center" type="index" label="序号" width="55"/>
      <el-table-column label="设备编号" prop="deviceCode"/>
      <el-table-column label="设备名称" prop="deviceName"/>
      <el-table-column label="类别" prop="category"/>
      <el-table-column label="采购金额" prop="purchaseAmount"/>
      <el-table-column label="当前净值" prop="netWorth"/>
      <el-table-column label="是否报废" prop="isScrap">
        <template slot-scope="scope">
          <template v-if="scope.row.isScrap==1">是</template>
          <template v-if="scope.row.isScrap==2">否</template>
        </template>
      </el-table-column>
      <el-table-column label="预计售卖金额" prop="presellAmount"/>
      <el-table-column label="实际金额" prop="actualAmount"/>
      <el-table-column label="备注" prop="remark"/>
      <el-table-column>
        <template slot-scope="scope">
          <el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <h4>相关文件</h4>
    <el-upload
      class="upload-demo"
      action="https://jsonplaceholder.typicode.com/posts/"
      :file-list="fileList">
      <el-button size="mini" type="warning" icon="el-icon-folder-add">上传</el-button>
    </el-upload>
    <div class="btn">
      <el-button type="primary" icon="el-icon-plus" size="mini" @click="saveBtn">保存</el-button>
      <el-button type="success"  icon="el-icon-plus" size="mini" @click="saveBtn">提交</el-button>
    </div>
    <addDialog v-if="addShow" @selectChange="addSelect"></addDialog>
  </div>
</template>

<script>
  import addDialog from "./addDialog";
    export default {
      name: "equipmentSoldEdit.vue",
      components:{
        addDialog
      },
      data(){
        return{
          date:'',
          addForm:{
            applyUser:'',
            sellInfo:'',
          },
          list:[],
          addShow:false,
          loading:false,
          fileList:[],
          addData:'',
        }
      },
      methods:{
        add(){
          this.addShow = true
        },
        addSelect(data){
          if(data){
            this.addData=data
          }
          this.addShow=false
        },
        saveBtn() {
          this.$router.push('/equipmentCZ/equipmentSold')
        },
        //删除
        handleDelete(row){
          this.$confirm('确定删除该数据吗？', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
          }).catch(() => {
            this.$message({
              type: 'info',
              message: '已取消删除'
            });
          });
        },
      }
    }
</script>
<style lang="scss">
  .equipmentSoldEdit {
    margin-left:20px;
    .el-button{
      margin-bottom:20px;
    }
    h4 {
      color: #05A380;
    }
    .fileList{
      border: 1px solid #cccccc;
      min-height: 50px;
      width:900px;
    }
    .table {
      width:900px;
      border: 1px solid #cccccc;
      color: #606266;
      font-size: inherit;
      tr {
        td:nth-child(2n-1) {
          width: 20%;
          text-align: center;
        }
        td:nth-child(2n) {
          width: 30%;
          padding-left: 10px;
        }
        td {
          line-height: 35px;
          .red {
            color: red;
          }
          .el-input--medium .el-input__inner,.el-textarea .el-textarea__inner{
            border: none;
          }
        }
      }
    }
    .btn{
      text-align: center;
      margin-top:20px;
    }
  }
</style>

